import React from "react";
import {TopicItem, TopicWrapper} from '../style'
import {connect} from "react-redux";

const Topic = (props) => {
    return (
        <TopicWrapper>
            {
                props.list.map((item) =>
                    (
                        <TopicItem key={item.get('id')}>
                            <img className='topic-pic'
                                 src={item.get('imgUrl')}/>
                            {item.get('title')}
                        </TopicItem>
                    )
                )
            }
        </TopicWrapper>
    );
}

const mapState = (state) => ({
    list: state.get('home').get('topicList')
});
export default connect(mapState, null)(Topic);